@charset "UTF-8";

.ui-markerselect {
  width: 75px;
  height: 60px;
  border: 1px solid silver;
  border-radius: 5px;
  -moz-border-radius: 5px;
  position: relative;
  float: none;
  display: inline-block;
  background-color: silver; /* for unsupported browers */
  background:
    -webkit-gradient(
      linear,
      left bottom, left top,
      color-stop(0.39, rgb(209,209,209)),
      color-stop(0.85, rgb(245,245,245)),
      color-stop(1, rgb(235,235,235))
    );
  background:
    -moz-linear-gradient(
      center bottom,
      rgb(209,209,209) 39%,
      rgb(245,245,245) 85%,
      rgb(235,235,235) 100%
    );
  margin: 5px 0 5px 0;
  cursor: pointer;
  z-index: 255;
}

.ui-markerselect .markerwrapper {
  position: absolute;
  width: 55px;
  height: 100%;
  left: 5px;
}

.ui-markerselect .shadow {
  position: absolute;
  width: 100%;
  height: 100%;
  background: url("../img/cross.gif") center center no-repeat;
}

.ui-markerselect .shadow .icon {
  position: absolute;
  background-position: 0 0;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
}

.ui-markerselect:after {
  width: 9px;
  height: 5px;
  position: absolute;
  content: url("../img/dropdown.gif");
  right: 2px;
  top: 15px;
}

.ui-markerselect.active {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
  -moz-border-bottom-right-radius: 0;
  -moz-border-bottom-left-radius: 0;  
  border-bottom: none;
  background: white;
}

.ui-markerselect.active:after {
  content: url("../img/rollup.gif");
  top: 12px;
}

.ui-markerselect-list {
  position: absolute;
  float: left;
  top: 59px; 
  width: 610px;
  margin: 0 0 0 -1px; /* align borders */
  border: 1px solid silver;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
  -moz-border-top-right-radius: 5px;
  -moz-border-bottom-right-radius: 5px;
  -moz-border-bottom-left-radius: 5px;  
  background: white;
  cursor: auto;
  box-shadow: 5px 5px 10px #000;
  --webkit-box-shadow: 5px 5px 10px #000;
}



/* begin tyny scrollbar styles */
/*#scrollbar1 { width: 520px; clear: both; margin: 20px 0 10px; }*/
.ui-markerselect-list .viewport { width: 600px; height: 250px; overflow: hidden; position: relative; }
.ui-markerselect-list .overview { list-style: none; position: absolute; left: 0; top: 0; }
.ui-markerselect-list .thumb .end,
.ui-markerselect-list .thumb { background-color: #003D5D; }
.ui-markerselect-list .scrollbar { position: relative; float: right; width: 7px; margin: 0 2px 0 0; }
.ui-markerselect-list .track { background-color: #D8EEFD; height: 100%; width:5px; position: relative; padding: 0 1px; }
.ui-markerselect-list .thumb { height: 20px; width: 5px; cursor: pointer; overflow: hidden; position: absolute; top: 0; }
.ui-markerselect-list .thumb .end { overflow: hidden; height: 5px; width: 13px; }
.ui-markerselect-list .disable{ display: none; }
/* end tyny scrollbar styles */

.ui-markerselect-list .item {
  position: relative;
  float: left;
  width: 198px;
  height: 58px;
  border: 1px solid transparent;
  border-radius: 3px;
  -moz-border-radius: 3px;
  cursor: pointer;
}

.ui-markerselect-list .item:hover {
  border-color: blue;
  background-color: #fbfbff;
}

.ui-markerselect-list .item .markerwrapper {
  position: relative;
  float: left;
}

.ui-markerselect-list .item .caption {
  float: left;
  overflow: hidden;
}